/**
 * react-navigation 每个版本的写法都不同
 */
import React from 'react'
import { NavigationContainer } from '@react-navigation/native'
import { createStackNavigator, CardStyleInterpolators } from '@react-navigation/stack'
import TestNavConfig from './config'

const NavStack = createStackNavigator()
const RootNav = NavStack

export default function App() {
  return (
    <NavigationContainer>
      <RootNav.Navigator mode='card' >
        {GetScreenArray()}
      </RootNav.Navigator>
    </NavigationContainer>
  )
}
function GetScreenArray() {
  const screenArray = []
  TestNavConfig.forEach(item => {
    const title = item.title || ''
    const name = item.name || ''
    const screen = item.screen
    const view = <RootNav.Screen
                    name={name} component={screen}
                    key={'nav_test_' + name}
                    options={e => {
                      const route = e.route
                      const routeParams = route.params || {}
                      const routeTitle = routeParams.title || ''
                      let config = {}
                      config.title = routeTitle || title
                      config.cardStyleInterpolator = CardStyleInterpolators.forHorizontalIOS
                      if (screen && screen.navigationOptions && typeof screen.navigationOptions === 'function') {
                        config = screen.navigationOptions(e)
                      }
                      return config
                    }} />
    screenArray.push(view)
  })
  return screenArray
}